<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<link rel="stylesheet" href="../../static/layui/css/layui.css" th:src="@{/static/layui/css/layui.css}" media="all">
<link href="//hnres.etalk365.com/public/css/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="../../static/css/jquery.datetimepicker.css"/>
<style type="text/css">
    .dynamic-wrap_out {
        padding: 0 20px;
        overflow-y: auto;
        height: 523px;
    }
    @media screen and (max-width: 1300px) {
        .dynamic-wrap_out {height: 485px;}
    }
    @media screen and (max-width: 1600px) {
        .dynamic-wrap_out {height: 485px;}
    }
    @media screen and (max-width: 1900px) {
        .dynamic-wrap_out {height: 523px;}
    }

    .dynamic-wrap {
        padding: 20px 20px;
        background: rgba(128, 128, 128, .1);
        min-height: 400px;
    }
    .flex-v-h-center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .no-data {
        height: 100%;
        width: 100%;
    }
    .item {
        padding: 3px 15px;
        box-shadow: 0 2px 8px 0 #eee;
        margin-bottom: 18px;
        background: #fff;
        border-radius: 4px;
    }
    .item-text {
        font-size: 14px;
        color: #333;
        margin-bottom: 3px;
        display: inline-block;
        /*margin: 10px 15px;*/
    }
    .item-text > .time {
        display: inline-block;
        font-size: 16px;
        font-weight: 600;
    }
    .flex-v-h-center {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .tag {
        display: inline-block;
        height: 26px;
        line-height: 25px;
        border-radius: 12px;
        color: #333;
        padding: 0 10px;
        border: 1px solid rgba(153, 153, 153, 1);
        cursor: pointer;
    }
    .tag-icon {
        margin-right: 6px;
    }
    /** @descritpion 高亮 */
    .tag:hover {
        color: #409eff;
        border: 1px solid #409eff;
    }
    .tag-ative, .tag-ative:hover {
        border-radius: 24px;
        color: #fff;
        background: #409eff;
        border: 1px solid rgba(153, 153, 153, 1);
        border: 1px solid #409eff;
    }
    .remind-time {
        color: #46BA7D;
    }
    .remind-time2 {
        color: red;
    }

    .finish-btn {
        display: inline-block;
        padding: 2px 10px;
        color: #fff;
        border-radius: 6px;
        margin-left: 10px;
        background: red;
        cursor: pointer;
    }

    .finish-btn1 {
        display: inline-block;
        padding: 2px 10px;
        color: #fff;
        border-radius: 6px;
        margin-left: 10px;
        background: #46BA7D;
        cursor: pointer;
    }

    .finish-btn2 {
        display: inline-block;
        padding: 2px 10px;
        color: #fff;
        border-radius: 6px;
        margin-left: 10px;
        background: #409eff;
        cursor: pointer;
    }
    .revoke {
        display: inline-block;
        padding: 2px 10px;
        color: #fff;
        border-radius: 6px;
        margin-left: 10px;
        background: #bd2130;
        cursor: pointer;
    }
    .questionnaire {
        display: inline-block;
        padding: 2px 10px;
        color: #fff;
        border-radius: 6px;
        margin-left: 10px;
        background: #ff6707;
        cursor: pointer;
    }
    .upload-wrap_out {
        padding: 10px 0 15px;
        position: relative;
    }
    .option {
        display: flex;
        justify-content: flex-start;
        align-content: center;
        flex-wrap: wrap;
    }
    .flex-shrik {
        flex-shrink: 0;
    }
    .upload-wrap {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        background: rgba(128, 128, 128, .1);
        padding: 10px 15px;
        margin-top: 15px;
    }
    .upload-item {
        box-shadow: 0 1px 6px 0 #eee;
        padding: 10px 15px;
        width: 200px;
        display: inline-block;
        word-break: break-all;
        margin: 10px 15px;
        background: #fff;
        border-radius: 8px;
    }
    .no-img {
        width: 100%;
        height: 38px;
        background: rgba(128, 128, 128, .1);
        margin: 10px 0;
        border-radius: 6px;
    }
    .upload-input {
        margin-top: 15px;
    }
    .img {
        margin: 10px 0;
        width: 100%;
    }
    .upload-item .del {
        display: inline-block;
        padding: 5px 15px;
        background: red;
        color: #fff;
        border-radius: 4px;
        cursor: pointer;
    }
    .upload-item .preview {
        display: inline-block;
        padding: 5px 15px;
        background: green;
        color: #fff;
        border-radius: 4px;
        cursor: pointer;
    }
    .margin-left {
        margin-left: 20px;
    }
    .margin-left-s {
        margin-left: 10px;
    }
    .input-item {
        position: relative;
        width: 100px;
        height: 38px;
        border-radius: 4px;
        border: 1px dashed #eee;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .input {
        opacity: 0;
        position: absolute;
        top: 0;
        height: 0;
        width: 100%;
        height: 100%;
    }
    .look {
        cursor: pointer;
        padding: 0px 20px;
        border-radius: 5px;
        border: 1px solid #409eff;
        display: inline-block;
        color: #409eff;
    }
    .submit {
        display: flex;
        justify-content: center;
        align-items: center;
        background: #409eff;
        color: #fff;
        border-radius: 6px;
        padding: 0 20px;
        cursor: pointer;
    }
    .prev-look {
        border-radius: 4px;
        border: 1px solid #409eff;
        padding: 4px 15px;
        color: #409eff;
        cursor: pointer;
    }
    .prev-look:hover {
        background: #409eff;
        color: #fff;
    }
    .stu-info{
        padding-top: 10px;
        padding-left: 18px;
    }
</style>
<body>
<form class="layui-form">
    <input type="hidden" id="personId" th:value="${personId}">
    <input id="source" type="hidden" th:value="${studentInfo.channelId}">
    <input id="fileUrl" type="hidden" th:value="${fileUrl}">
    <input id="parentId" type="hidden" th:value="${studentInfo.parentId}">
    <input id="state" type="hidden" th:value="${studentInfo.state}">
    <input id="revisitName" type="hidden" th:value="${studentInfo.revisitName}">
    <input id="studentLogin" type="hidden" th:value="${studentInfo.loginName}">
    <input id="sscCheck" type="hidden" th:value="${sscCheck}">
    <input id="intention" type="hidden" th:value="${studentInfo.intention}">
    <input id="remindId" type="hidden" th:value="${param.remindId}">
    <input id="from" type="hidden" th:value="${from}">
    <div class="stu-info" th:if="!${#strings.equalsIgnoreCase(from, 'personInfo')}">
        【学员姓名: <span th:text="${(studentInfo.cnName==null || #strings.equals(studentInfo.cnName,''))?'无':studentInfo.cnName}">studentInfo.cnName</span>】
        【账号: <span th:text="${studentInfo.loginName}">studentInfo.loginName</span>】
        【手机: <span th:text="${studentInfo.phone}">studentInfo.phone</span>】
        【推荐人: <span th:text="${(studentInfo.qrCode==null || #strings.equals(studentInfo.qrCode,''))?'无':studentInfo.qrCode}">无</span>】
    </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-bottom: 0;">
        <legend style="font-size: 16px;color: #19a2e3;font-weight: bold;">发布动态</legend>
    </fieldset>
    <div class="layui-form-item layui-form-text" style="margin-bottom: 0;">
        <div class="layui-input-block" style="width: 99%; margin-left: 20px;">
            <textarea id="contentInfo" placeholder="请输入内容" class="layui-textarea" maxlength="2000"></textarea>
            <div id="upload" class="upload-wrap_out">
                <div class="option">
                    <!-- 蓝色背景： tag-ative -->
                    <div
                            class="tag margin-left-s"
                            style="margin-top: 10px"
                            :class="{
                                'tag-ative': item.status
                            }"
                            v-for="(item, index) in revisitList"
                            :key="'revisitlist' + index"
                            @click="selectLabel(index,item)">
                        <i class="state" value="item.id">{{item.levelName}}</i>
                    </div>
                    <div class="flex-v-h-center flex-shrik" style="width: 180px;">
                        <div class="layui-input-inline margin-left">
                            <!--style="border-color: #eee;width:160px;height: 38px;line-height: 1.3;line-height: 38px\9;border-width: 1px;border-style: solid;background-color: #fff;border-radius: 2px;padding-left: 10px;"<input type="text" name="remindTime" id="remindTime" lay-verify="remindTime" placeholder="请选择提醒日期" autocomplete="off" class="layui-input">-->
                            <input class="layui-input" type="text" name="remindTime" id="remindTime" placeholder="设置提醒时间" title="设置提醒时间" autocomplete="off">
                        </div>
                    </div>

                    <div class="flex-v-h-center flex-shrik" style="margin-left: 10px;width: 160px;">
                        <select name="sscCCId" th:if="${session.roleId !=2 and session.roleId !=8 and session.roleId !=9}">
                            <option value="0">请选择提醒人</option>
                            <option th:value="${studentInfo.ccId}"  th:text="${studentInfo.ccLogin}"></option>
                            <option th:value="${studentInfo.sscId}"  th:text="${studentInfo.sscLogin}"></option>
                        </select>
                    </div>
                    <div class="flex-v-h-center input-item flex-shrik margin-left-s">
                        <span >点击上传附件</span>
                        <input class="input" type="file" @change="change" ref="uploadEle" style="cursor: pointer;">
                    </div>
                    <!-- <div class="layui-inline margin-left"> -->
                    <span class="submit flex-shrik margin-left-s" onclick="showClassStores()">发 布</span>
                    <!-- </div> -->
                </div>

                <div class="upload-wrap" v-if="files.length">
                    <div
                            v-for="(item, index) in files"
                            :key="index + 'upload'"
                            class="upload-item"
                    >
                        <p style="text-align: center;">{{item.fileName}}</p>
                        <template v-if="isNoImg(item.img)">
                            <span class="no-img flex-v-h-center" style="height: 100px;">{{getBack(item.img)}}</span>
                        </template>
                        <template v-else>
                            <!-- getStyle(item.img) -->
                            <div :style="getStyle(item.img)"
                                 class="img"
                            >
                            </div>
                            <!-- <img class="img" :src="fileUrl + item.img" alt="图片"> -->
                        </template>
                        <div style="text-align: center;">
                            <span class="del" @click="del(index)">删除</span>
                            <span class="preview" v-if="isNoImg(item.img)==false" @click="preview(fileUrl + item.img)">点击预览大图</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 0;margin-bottom: 0;">
        <legend style="font-size: 16px;color: #19a2e3;font-weight: bold">最新动态</legend>
    </fieldset>
    <div id="dynamicPage" class="dynamic-wrap_out" >
        <div class="dynamic-wrap" :class="{'flex-v-h-center': !dynamicList.length }" v-if="!loading">
            <div v-if="dynamicList.length">
                <div v-for="(item, index) in dynamicList">
                    <div class="layui-row layui-col-space15">
                        <div class="item">
                            <div class="item-text">
                                <div class="time">
                                    {{format(item.addTime)}} 动态 ({{item.addUser}})
                                    <span class="questionnaire" v-if="item.questionnaireId > 0"
                                          @click="lookPaper(item)">查看问卷</span>
                                    <span v-if="item.sscCCName && item.sscCCName !='' && item.sscCCName != item.addUser">为{{item.sscCCName}} 设置</span>
                                    <div class="item-text">
                                        <div  v-if="item.remindTime && item.state === 0">
                                            <span style="color:red " v-if="item.remindTime && new Date(item.remindTime).getTime()<new Date().getTime()">提醒时间⏰：{{format(item.remindTime)}}</span>
                                            <span style="color: #409eff" v-if="item.remindTime && new Date(item.remindTime).getTime()>=new Date().getTime()">提醒时间⏰：{{format(item.remindTime)}}</span>
                                            <span class="finish-btn" v-if="item.state === 0 && item.sscCCId === addUserId && new Date(item.remindTime).getTime()<new Date().getTime()" @click="finish(item.id)">完成</span>
                                            <span class="finish-btn2" v-if="item.state === 0 && item.sscCCId === addUserId && new Date(item.remindTime).getTime()>=new Date().getTime()" @click="finish(item.id)">完成</span>
                                        </div>

                                        <div v-else class="remind-time" v-if="item.state ===1">
                                            <span v-if="item.remindTime">提醒时间⏰：{{format(item.remindTime)}}</span>
                                            <span class="finish-btn1">已完成</span>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- 动态内容 -->
                            <div  class="item-text" style="display: block" v-if="item.content.indexOf('【') !== -1" >
                                <span v-html="item.content"></span>
                                <cancel-component :item="item"></cancel-component>
                            </div>
                            <div class="item-text"  style="display: block" v-if="item.content.indexOf('【')===-1">
                                <span v-if="item.name">
                                    【{{item.name}}】
                                </span>
                                <span v-html="item.content"></span>
                                <cancel-component :item="item"></cancel-component>
                            </div>

                            <div v-if="typeof item.fileUrls === 'object' && item.fileUrls.length" class="look prev-look" @click="item.lookStatus = !item.lookStatus">{{!item.lookStatus ? '查看附件' : '收起'}}</div>
                            <div class="upload-wrap" v-show="item.lookStatus" :id="index + 'look'" v-if="typeof item.fileUrls === 'object' && item.fileUrls.length">
                                <div
                                        v-for="(item, index) in item.fileUrls"
                                        :key="index + 'upload'"
                                        class="upload-item"
                                >
                                    <p>{{item.fileName}}</p>
                                    <template v-if="isNoImg(item)">
                                        <span class="no-img flex-v-h-center">{{getBack(item)}}</span>
                                    </template>
                                    <template v-else>
                                        <div :style="getStyle(item)"
                                             class="img"
                                        >
                                        </div>
                                    </template>
                                    <div>
                                        <!--<a class="prev-look" v-if="isNoImg(item)" :href="fileUrl + item" :download="item">下载</a>
                                        <a class="prev-look" v-else href="javascript:" @click="preview(fileUrl + item)" :download="item">点击预览大图</a>-->
                                        <a class="prev-look" :href="'/stuDynamic/attachments/download?filePath='+ fileUrl + item" target="_blank">下载</a>
                                        <a class="prev-look" :href="fileUrl + item" target="_blank" :download="item">点击预览大图</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div v-else class="no-data flex-v-h-center">没有数据哦</div>
        </div>
        <div class="dynamic-wrap flex-v-h-center" v-else>
            数据正在加载...
        </div>
        <div class="" id="demo7"></div>
    </div>
</form>
<script src="https://hkres.etalk365.com/public/lib/jquery/jquery.min.js" type="text/javascript"></script>
<script src="../../static/layui/layui.js" th:src="@{/static/layui/layui.js}" ></script>
<script type="text/javascript" src="../../static/js/vue.min.js" th:src="@{/static/js/vue.min.js}"></script>
<script src="../../static/js/jquery.datetimepicker.js" th:src="@{/static/js/jquery.datetimepicker.js}"></script>
<script>
    $(function(){
        /**
         * 获取当天设置的提醒次数
         * @param currentDay 当前日月
         * @param remindTime 选则的日期
         */
        function getRemindCount(currentDay,remindTime){
            $.ajax({
                type: 'post',
                url: '/stuDynamic/getRemindCount',
                data: {
                    'remindTime': remindTime
                },
                cache: false,
                async: false,
                dataType: 'json',
                success: function (data) {
                    if (data.isSuccess == 1) {
                        var remindCount = data.remindCount;
                        $(".remindMessage").html(currentDay + "已经设置 " + remindCount + " 个提醒了哦");
                    } else {
                        alert("未知错误，请联系管理员！");
                    }
                }
            });
        }
        $('#remindTime').datetimepicker({
                lang: 'ch',
                step: 15,
                minDate: 0,
                minTime: '08:00',
                format: 'Y-m-d H:i:s',
                onShow: function (ct) {
                    getRemindCount(ct.dateFormat('m-d'),ct.dateFormat('Y-m-d'));
                },
                onSelectDate: function (ct, $i) {
                    getRemindCount(ct.dateFormat('m-d'),ct.dateFormat('Y-m-d'));
                }
            }
        );
    });

</script>
<script>
    /** @description 上传附件 */
    let fileUrl = $("#fileUrl").val();
    let noImg = ['mp3', 'mp4', 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx', 'csv', 'zip', 'rar', 'txt', 'pdf']
    let upload = new Vue({
        el: '#upload',
        data: {
            files: [], // 上次传的列表
            noImg: noImg,
            uploadLoading: false, // 上次 loading
            fileUrl: fileUrl,
            state: $("#parentId").val(),
            selectItem: {},
            remindState: true,
            revisitList: [ /** @description 动态列表 */

            ],
        },
        methods: {
            getStyle(item) {
                let url = this.fileUrl + item
                return {
                    'background-image': `url("${url}")`,
                    'background-repeat': 'no-repeat',
                    'background-position': 'center',
                    'background-size': 'contain',
                    /*'width': '100px',*/
                    'height': '100px'
                }
            },
            getBack(url) {
                if (!url) return ''
                let index = url.lastIndexOf('.');
                return url.slice(index + 1);
            },
            isNoImg(url) {
                return this.noImg.indexOf(this.getBack(url)) > -1
            },
            /** @description 切换选中的标签 */
            selectLabel(outIndex, item) {
                upload.revisitList.map(function (item, index) {
                    if (index === outIndex) {
                        item.status = true
                    } else {
                        item.status = false
                    }
                    return item
                });
                if (item.id > 3) {
                    upload.state = 4;
                    // console.info();
                    // $("#remindTime").show();
                    // $("#time").show();
                    // $("select[name='sscCCId']").show();
                } else {
                    upload.state = 1;
                    // $("#remindTime").hide();
                    // $("#time").hide();
                    // $("select[name='sscCCId']").hide();
                }
                upload.selectItem = item;
            },
            change() {
                upload.uploadLoading = true
                let card = upload.$refs.uploadEle.files[0]
                let render = new FileReader()
                let type = 4
                let size = 3

                if (!card) {
                    layer.msg("获取文件失败，请重新上传！", {icon: 1});
                    upload.$refs.uploadEle.value = ''
                    return
                }
                let carList = ['jpg', 'jpeg', 'gif', 'png', 'mp3', 'mp4', 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx', 'csv', 'zip', 'rar', 'txt', 'pdf']

                let name = card.name.split('.')
                name = name[name.length - 1].toLowerCase()

                let status = carList.every(function (item) {
                    return name.indexOf(item) === -1
                });

                if (status) {
                    layer.msg('请上传' + carList.join(',') + '格式的文件！', {icon: 2});
                    upload.$refs.uploadEle.value = '';
                    return
                }

                if ((card.size || card.size.toString() === '0') && card.size > (size * 1024 * 1024)) { // 判断文件的大小
                    let fileSize = '文件大于' + size + 'M'
                    layer.msg(fileSize, {icon: 2});
                    upload.$refs.uploadEle.value = '';
                    return;
                }
                upload.uploadLoading = true;
                upload.uploadFile(card)
            },
            uploadFile(file) {
                let formData = new FormData();
                formData.append('uploadFiles', file);
                $.ajax({
                    type: 'post',
                    url: '/stuDynamic/uploadDynamicsAttachment',
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function (data) {
                        if (data && typeof data.imgList === 'object' && data.imgList) {
                            upload.files = upload.files.concat(data.imgList);
                            layer.msg("上传成功", {icon: 1});

                        }
                        upload.$refs.uploadEle.value = ''
                    },
                    error: function (xhr, type, exception) {
                        layer.msg(xhr.responseText, "Failed");
                    }
                });
            },
            del(index) {
                upload.files.splice(index, 1)
            },
            preview: function (url) {
                let json = {
                    "status": 1, "msg": "", "title": "附件预览", "id": 1, "start": 0,
                    "data": [
                        {
                            "alt": "附件",
                            "pid": 1,
                            "src": url,
                            "thumb": ""
                        }
                    ]
                };
                layer.photos({
                    photos: json //格式见API文档手册页
                    ,shade: 0.6
                    , anim: 4 //0-6的选择，指定弹出图片动画类型，默认随机
                });
            }
        }
    });
    let cancelComponent = {
        name: 'cancel-component',
        props: ['item'],
        data: function () {
            return {
                time: 0,
                diff: 0,
                limit: 5 * 60 * 1000
            }
        },
        methods: {
            handleTime: function (diff) {
                diff = diff / 1000
                var S_M = diff
                var S = S_M % 60
                var M = (S_M / 60) % 60

                return parseInt(M) + '分钟' + parseInt(S) + '秒'
            },
            /** @description 撤销方法 */
            revoke() {
                revokeDynamic(this.item.id, new Date());
            }
        },
        // <span>{{time}} 后无法撤销<span>
        template: `
                <div style="display:inline-block" v-if="diff < limit">
                        <span @click="revoke(item)" class="revoke">撤销</span>
                </div>`,
        created() {
            // console.log(this.item)
        },
        mounted() {
            var that = this
            var addTime = new Date(that.item.addTime).getTime()
            var currentTime = new Date().getTime()
            var diff = currentTime - addTime
            that.diff = diff
            // var five = 10 * 24 * 60 * 60 * 1000
            if (diff < that.limit) {
                var timer = setInterval(function () {
                    var currentTime = new Date().getTime()
                    var diff = currentTime - addTime
                    that.diff = diff
                    that.time = that.handleTime(diff)
                    if (diff >= that.limit) {
                        clearInterval(timer)
                    }
                }, 1000)
            }
        }
    }

    function add0(m) {
        return m < 10 ? '0' + m : m
    }

    function format(shijianchuo) {
        //shijianchuo是整数，否则要parseInt转换
        var time = new Date(shijianchuo);
        var y = time.getFullYear();
        var m = time.getMonth() + 1;
        var d = time.getDate();
        var h = time.getHours();
        var mm = time.getMinutes();
        var s = time.getSeconds();
        return y + '-' + add0(m) + '-' + add0(d) + ' ' + add0(h) + ':' + add0(mm) + ':' + add0(s);
    }

    // Vue.component(cancelComponent.name, cancelComponent)
    /**
     * @description 动态列表
     */
    var dynamicPage = new Vue({
        el: '#dynamicPage',
        data: {
            addItem: {},
            show: false, // 获取焦点
            text: '',
            noImg: noImg,
            loading: true,
            fileUrl: fileUrl,
            dynamicList: [ /** @description 动态列表 */
            ],
            addUserId: {},
            dynamicsId: {},
            filesTest: []
        },
        components: {
            'cancel-component': cancelComponent
        },
        methods: {
            getTime(addTime) {
                var time = new Date(addTime)
                var getMonth = time.getMonth() + 1
                getMonth = getMonth ? (getMonth.toString().length === 1 ? `0${getMonth}` : getMonth) : getMonth

                var getDay = time.getDay()
                getDay = getDay ? (getDay.toString().length === 1 ? `0${getDay}` : getDay) : getDay

                var getHours = time.getHours()
                getHours = getHours ? (getHours.toString().length === 1 ? `0${getHours}` : getHours) : getHours

                var getMinutes = time.getMinutes()
                getMinutes = getMinutes ? (getMinutes.toString().length === 1 ? `0${getMinutes}` : getMinutes) : getMinutes

                var getSeconds = time.getSeconds()
                getSeconds = getSeconds ? (getSeconds.toString().length === 1 ? `0${getSeconds}` : getSeconds) : getSeconds

                return `${time.getFullYear()}-${getMonth}-${getDay} ${getHours}:${getMinutes}:${getSeconds}`
            },

            lookPaper(item) {
                var url = "http://crm.etalk365.com/questionnaireOc/checkPapers?questionnaireId=" + item.questionnaireId;
                layer.open({
                    type: 2,
                    title: false,
                    closeBtn: 1, //显示关闭按钮
                    shade: [0.5],
                    area: ['60%', '60%'],
                    //offset: 'rb', //右下角弹出
                    // time: 2000, //2秒后自动关闭
                    anim: 2,
                    content: [url, 'yes'], //iframe的url，no代表不显示滚动条
                });
            },
            getStyle(item) {
                var url = this.fileUrl + item
                //console.log(url)
                return {
                    'background-image': `url("${url}")`,
                    'background-repeat': 'no-repeat',
                    'background-position': 'center',
                    'background-size': 'contain',
                    'width': '100px',
                    'height': '100px'
                }
            },
            download(dataUrl) {
                /*var a = document.createElement('a')
                a.href = dataUrl
                a.download = name
                a.style.display = 'none';
                document.body.appendChild(a);
                a.click();
                cons;*/
               // download(dataUrl);
            },
            look(id) {
                // console.log($(`${id}`).show())
                $(`${id}`).show()
            },
            /** @description 获取链接的后缀名字 */
            getBack(url) {
                if (!url) return ''
                let index = url.lastIndexOf('.');
                const str = url.slice(index + 1)
                return str
            },
            /** @description 判断是不是上传得是图片 */
            isNoImg(url) {
                return dynamicPage.noImg.indexOf(dynamicPage.getBack(url)) > -1
            },
            preview: function (url) {
                let json = {
                    "status": 1, "msg": "", "title": "附件预览", "id": 1, "start": 0,
                    "data": [
                        {
                            "alt": "附件",
                            "pid": 1,
                            "src": url,
                            "thumb": ""
                        }
                    ]
                };
                layer.photos({
                    photos: json //格式见API文档手册页
                    ,shade: 0.6
                    , anim: 4 //0-6的选择，指定弹出图片动画类型，默认随机
                });
            },
            /** @description 13位时间戳转化为格式化时间 */
            formatTime(time) {
                if (!(+time)) return
                var date = new Date(time); // 增加8小时
                return date.toJSON().substr(0, 19).replace('T', ' ').replace(/-/g, '-');
            },
            compareTime(time1, time2) {
                var date1 = new Date(time1);
                var date2 = new Date(time2);
                if (date1 > date2) {
                    return true
                } else {
                    return false;
                }
            },
            // revoke(id){
            //     revokeDynamic(id,new Date());
            // },
            /** @description 完成操作 */
            finish(id) {
                finishDynamic(id);
            }
        }
    })

    layui.use(['form', 'layedit', 'laydate', 'table'], function () {
        var form = layui.form
            , layer = layui.layer
            , laydate = layui.laydate
            , table = layui.table;
        var layedit = layui.layedit;
        //日期

        // laydate.render({
        //     elem: '#remindTime',
        //     min: 'new Date()', //最小值今天
        //     type: 'datetime',
        // });

    });
    /*下载附件*/
    function download(url) {
        let $eleForm = $("<form method='get'><input type='hidden' name='filePath' value='" + url + "'></form>");
        $eleForm.attr("action", "/stuDynamic/attachments/download");
        $(document.body).append($eleForm);
        //提交表单，实现下载
        //$eleForm.submit();
    }
</script>
<script>
    var loading = true
    $(function(){
        dynamicPageInfo(1,0);
        selectAllRevisit();
    });
    //装变量的容器,可以使用多个分页器哦!
    var dataObj = {
        page_enterprise : 1,
        page_order : 1,
        page_log: 1,
        page_log_info: 1,
        limit_enterprise: 10,
        limit_order: 10,
        limit_log:   10,
        limit_log_info: 10
    }
    function dynamicPageInfo(page,dynamicsId) {
        loading = true;
        dynamicPage.loading = true;
        $.ajax({
            type:'post',
            url:'/stuDynamic/dynamicPageInfo',
            data : {"personId" : $("#personId").val(),"page" : page},
            dataType:"json",
            success:function(data){
                loading = false
                dynamicPage.loading = false
                //console.info(data.pageInfo.list);
                dynamicPage.dynamicList = data.pageInfo.list.map(function(item, index) {
                    item.lookStatus = false
                    item.fileUrls = []
                    /** @description fileurl 是通过 ， 分割 */
                    if (item.fileUrl) {
                        //console.log(item.fileUrl, index)
                        item.fileUrls = item.fileUrl.split(',') || []
                    }
                    return item
                })
                dynamicPage.addUserId = data.addUserId;
                dynamicPage.dynamicsId = dynamicsId;
                var total = data.pageInfo.total;
                layui.use(['laypage'], function(){
                    var laypage = layui.laypage;
                    //完整功能
                    laypage.render({
                        elem: 'demo7',
                        count: total,
                        limit: dataObj.limit_enterprise,
                        first: '首页',
                        last: '尾页',
                        loading: true, //翻页加loading
                        layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
                        curr: dataObj.page_enterprise,
                        theme: '#00A0E9',
                        jump: function(obj, first){
                            if(!first) {
                                dataObj.page_enterprise = obj.curr;
                                dataObj.limit_enterprise= obj.limit;
                                var curr = obj.curr;
                                loading = true;
                                dynamicPage.loading = true;
                                dynamicPageInfo(curr);
                            }
                        }
                    });
                });
            },
            error : function(xhr, type, exception) {
                layer.msg(xhr.responseText, "Failed");
            }
        });
    }

    function myalert(btn1, btn2, callback) {
        var htmlstr = '<div class="myalert" style="width: 100%;height:100%;position: absolute;top: 0;left: 0;bottom:0;background: rgba(0,0,0,0.5);"><div class="main" style="width: 400px;height:210px;background: #fff;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);border-radius: 6px;"><h4 style="margin:0;padding:20px 0;border-bottom: 1px solid #d7d7d7;text-align: center;font-weight: normal;">小调查</h4><div><p style="text-align: center;margin-top: 10px;">学员最近是否有到店咨询或体验？</p><ul style="margin-top:40px;display: flex;display: -webkit-flex;list-style: none;"><li style="flex: 1;"><button style="display: block;width:90px;margin-left: 60px;height: 30px;border:none;background: #409eff;color: #fff;border-radius: 6px;padding: 0 20px;cursor: pointer;" num="1">' + btn1 + '</button></li><li style="flex: 1;"><button style="display: block;width:90px;margin-left: 60px;height: 30px;background: #fff;border:none;background: #409eff;color: #fff;border-radius: 6px;padding: 0 20px;cursor: pointer;" num="2">' + btn2 + '</button></li></ul><p style="text-align: center;font-size: 14px;margin-top:14px"><b style="color: red;">*</b>任意答案将继续提交动态</p></div></div></div>';
        $("body").append(htmlstr)
        $(".myalert li button").click(function () {
            var num = $(this).attr('num')
            callback(num)
            $(".myalert").remove()
        })
    }

    let classStores = 0;
    function showClassStores() {
        let classStore = $("#intention").val();
        if (classStores == 0) {
            classStores = classStore;
        }
        if (classStores != null && classStores == 0) {
            let source = $("#source").val();
            if (33 == source || 102 == source || 6 == source) {
                myalert('是', '否', function (checkNum) {
                    addDynamic(checkNum);
                    classStores = checkNum;
                })
            } else {
                addDynamic();
            }
        } else {
            addDynamic();
        }
    }


    //发布动态
    function addDynamic(checkNum) {
        //动态内容
        let contentInfo = jQuery.trim($("#contentInfo").val());
        let sscCheck = $("#sscCheck").val();
        //附件预览ID数组
        let files = upload.files;
        //console.info(files);
        let attachmentUrl = [];
        let attachmentPreviewId = [];
        //附件链接数组
        if(files.length){
            $(files).each(function () {
                attachmentUrl.push(this.img);
                attachmentPreviewId.push(0);
            });
        }

        if (contentInfo === "" || contentInfo.length === 0) {
            layer.msg("动态内容不能为空!", {icon: 2});
            return;
        } else if (contentInfo.length > 2000) {
            layer.msg("动态内容不能超过2000字符!", {icon: 2});
            return;
        }

        let remindTime = $("#remindTime").val();
        if(remindTime !== '' && remindTime !== undefined){
            if(new Date(remindTime) < new Date()){
                layer.msg("设置提醒时间不能小于当前时间",{icon: 2});
                return;
            }
        }
        let sscCCId = 0;
        if ($('select[name="sscCCId"]').val() !== "") {
            sscCCId = $('select[name="sscCCId"]').val();
        }
        let stuState = upload.selectItem.id;
        if(8 === stuState || 13 === stuState || 0 < sscCCId){
            if("" == $("#remindTime").val()){
                layer.msg("请设置提醒日期",{icon: 2});
                return;
            }
            let start = new Date($("#remindTime").val().replace("-", "/").replace("-", "/"));
            let endTime = "${now.getStringToday()}";
            let end = new Date(endTime.replace("-", "/").replace("-", "/"));
            if (end > start) {
                layer.msg("提醒日期时间不能小于当前时间",{icon: 2});
                return;
            }
        }
        if(stuState === '' || stuState === undefined){
            stuState = $("#state").val();
        }
        console.log("stuState=>",stuState);
        // return;
        let ajaxParam = {
            'content': contentInfo,
            'studentLogin': $("#studentLogin").val(),
            'personId': $("#personId").val(),
            'classStores': checkNum,
            'state': stuState,
            'remindId': $("#remindId").val(),
            'remindTime': new Date(remindTime),
            'sscCheck': sscCheck,
            'attachmentPreviewId': attachmentPreviewId,
            'attachmentUrl': attachmentUrl,
            'sscCCId': sscCCId
        };

        $.ajax({
            type: 'post',
            url: '/stuDynamic/addDynamic',
            data :JSON.stringify(ajaxParam),
            cache:false,
            contentType:"application/json;charset=utf-8",
            dataType:'json',
            success: function (data) {
                if (data.isSuccess > 0) {
                    //设置客户属性
                    //console.log(data.lastRevisitStatus);
                    //
                    layer.msg("动态发布成功", {icon: 1});
                    upload.files = [];
                    //去掉已选的标签
                    // upload.selectItem={};
                    // 重新选中
                    //$("#state").val(stuState);
                    //$("#parentId").val(stuState);
                    //alert($("#state").val())
                    //selectAllRevisit();
                    //window.location.reload();
                    var from = $("#from").val();
                    if (from === "personInfo") {
                        parent.window.location.reload();
                    } else {
                        window.location.reload();
                    }

                    //dynamicPageInfo(1,data.dynamicsId);
                    //$("#contentInfo").val("");
                    //$("#remindTime").val("");
                    //$("#time").val("");
                } else if(data.isSuccess===-2){
                    layer.msg("提醒日期时间不能小于当前时间！", {icon: 2});
                } else if(data.isSuccess===-3){
                    layer.msg("选择提醒人必须设置提醒时间！", {icon: 2});
                } else {
                    layer.msg("动态发布失败，请联系管理员！", {icon: 2});
                }


            }
        });
    }

    //撤销动态
    function revokeDynamic(id, time) {
        //询问框
        layer.confirm('确认撤销动态系统会删除以下内容<br><div class="text-left">已设置的提醒时间<br>已发布的附件<br>已发布的动态内容，<br>返回到最近动态记录的客户属性</div>', {
            btn: ['确认', '取消'] //按钮
        },  function () {
            var addTime = new Date(time).getTime();
            //console.log("addTime:" + addTime);
            var now = new Date().getTime();
            //console.log("now:" + now);
            //console.log("now - addTime:" + (now - addTime));
            if (now - addTime > 5 * 60 * 1000) {
                layer.msg("动态发布时间超过5分钟，禁止撤销！", {icon: 2});
                //2s后消失
                window.setTimeout(function () {
                    layer.closeAll('dialog');
                }, 2000);
                return false;
            }

            $.ajax({
                type: 'post',
                url: '/stuDynamic/revokeDynamic',
                data: {"dynamicsId": id, "personId": $("#personId").val()},
                cache: false,
                async: false,
                dataType: 'json',
                success: function (data) {
                    if (data.isSuccess > 0) {
                        //删除动态html
                        var fd = $("#" + id);
                        // console.log($(fd).html());
                        $(fd).remove();
                        //设置客户属性
                        //console.log(data.lastRevisitStatus);
                        dynamicPageInfo(1,0);
                        // $("select[name='studentInfo.state']").val(data.lastRevisitStatus);
                        // changeRevisit();
                        layer.msg("动态撤销成功", {icon: 1});
                    } else {
                        layer.msg("撤销失败，请联系管理员！", {icon: 2});
                    }
                }
            });
            //2s后消失
            window.setTimeout(function () {
                layer.closeAll('dialog');
            }, 2000);
        });
    }

    //完成提醒
    function finishDynamic(dynamicsId) {
        //console.info(dynamicsId)
        layer.confirm('确认完成本次提醒吗', {
            btn : [ '确定', '取消' ]//按钮
        },function () {
            $.ajax({
                type: 'post',
                url: '/stuDynamic/modifyStudentAttribute',
                data: {'dynamicsId': dynamicsId},
                cache: false,
                async: false,
                dataType: 'json',
                success: function (data) {
                    if (data.code == 1) {
                        layer.msg("操作成功", {icon: 1});
                        dynamicPageInfo(1);
                        sessionStorage.setItem('isVoidFresh', '3');
                    } else if (data.code == 0) {
                        layer.msg("完成提醒失败！");
                    } else if (data.code == -1) {
                        layer.msg("参数错误！");
                    } else if (data.code == -2) {
                        layer.msg("提醒时间距离当前时间在10分钟以内，请重新选择提醒时间！", {icon: 2});
                        $('#remindTime').val('');
                    } else {
                        layer.msg("未知错误，请联系管理员！", {icon: 2});
                    }
                    //$('#add').removeClass('disabled');
                }
            });
        });
    }

    //标签
    function selectAllRevisit() {
        let state=$("#parentId").val();
        let origianlState=$("#state").val();

        if($("#revisitName").val()==""){
            state=1;
            origianlState=-1;
            console.log("no revist")
        }else{
            console.log($("#revisitName").val());
        }

        //console.log("state=>",state)
        //console.log("origianlState=>",origianlState)
        $.ajax({
            type: 'post',
            url: '/stuDynamic/selectAllRevisit',
            data: {
                'state': state,
                'origianlState': origianlState
            },
            cache: false,
            async: false,
            dataType: 'json',
            success: function (data) {
                const currentState = origianlState;
                const parentState = state;
                /*console.log("currentState=>",currentState)
                console.log("parentState=>",parentState)*/
                let currentItem;
                //console.log("revisitData=>", data)
                upload.revisitList = data.selectAllRevisit.map(function (item, index) {
                    item.status = false
                    return item
                });

                // 如果匹配，调用选中方法
                data.selectAllRevisit.map(function (item, index) {
                    // console.log(item)
                    if (currentState == item.id) {
                        // 正式学员特殊处理
                        if (parentState == 9) {
                            $("#state").val(9);
                            return;
                        }
                        // 过期学员特殊处理
                        if (parentState == 12) {
                            $("#state").val(12);
                            return;
                        }
                        upload.selectLabel(index, item)
                        currentItem = item;
                        // alert("matched")
                    }
                });
                // console.log("currentItem=>",currentItem)

                //去掉已选的标签
                if(typeof currentItem != "undefined"){
                    upload.selectItem = currentItem;
                }else{
                    upload.selectItem={};
                }
                // console.log("upload.selectItem=>",upload.selectItem)
            }
        });
    }
</script>

</body>
</html>